<template>
   <div id="color">
   <!-- <iframe id="color" :src="`http://www.php.com/1.html?id=${this.assid}&access_tokin=${this.tokin}`" frameborder="0"></iframe> -->
   <!-- <iframe id="color" :src="`https://www.baidu.com?id=${this.assid}&access_tokin=${this.tokin}`" frameborder="0"></iframe> 491872.58695992,4057946.9299242-->
   <iframe id="iframegis" :src="`http://172.16.9.130:8888/mapgis/hotlineGis.html?type=${this.iframetype}&gisxy=${this.iframegisxy}&timespan=${this.iframetimespan}`" width="100%" height="800px" frameborder="0" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="auto" allowfullscreen="true"></iframe>
   <span style="display:none;" id="gisxyvalue"  >{{this.gisxyval}}</span>
   </div>
</template>
<style scoped>
</style>
<script>
export default {
  data() {
    return {
        srcurl:"https://www.baidu.com?id=${this.assid}&access_tokin=${this.tokin}",
        gisxyval:""
    };
  },
  methods: {
    changecolor() {
      var dd = document.querySelector("#color");
      console.log(this.assid);
      var tt = `https:www.baidu.com?id=${this.assid}&access_tokin=${
        this.tokin
      }`;
      //dd.setAttribute(‘src‘,tt)
      dd.innerHTML = tt;
    },
    emitFather(data){
      this.$emit('listenChildEvent',data);
    }
  },
  mounted() {
    window.onload = function() {
       
      this.srcurl="https://www.baidu.com/1";
      var iframe = document.getElementById("iframegis");
      var targetOrigin = "http://www.php.com"; 
      var dite="qwe"
      //iframe.contentWindow.postMessage(dite, targetOrigin);
      var dd = document.querySelector("#color");
     // dd.innerHTML = targetOrigin;
        
      
    };
      window.addEventListener('message',function(event){
         //此处执行事件
         console.log(event.data);
        // $("#gisxyvalue").val(event.data);
         //this.iframecallbackgisxy=event.data;
         this.gisxyval=event.data;
         this.iframecallbackgisxy=event.data;
           console.log(this.gisxyval);
           //emitFather(this.gisxyval);
           window.Event = new Vue();
           this.$emit('listenChildEvent',event.data);
        })
         
    //this.changecolor();
  },
  computed: {},
  props: ["iframegisxy", "iframetimespan","iframetype"]
};
</script>